<template>
    <div class="org-container">
        <div class="control-area">
            <router-link to="/permission/org-create">
                <el-button
                        type="primary"
                        size="small"
                        icon="el-icon-circle-plus-outline"
                        v-has="'system:org:add'"
                >
                    添加组织
                </el-button>
            </router-link>
        </div>
        <el-table
                :data="tableData"
                style="width: 100%;margin-bottom: 20px;"
                row-key="orgId"
                border
                size="small"
                default-expand-all
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
            <el-table-column prop="orgName" label="组织名称"></el-table-column>
            <el-table-column :show-overflow-tooltip="true" prop="" label="操作" width="150">
                <template slot-scope="scope">
                    <el-popconfirm
                            title="确定删除该条组织信息吗？"
                            @confirm="del(scope.row)"
                    >
                        <el-button type="danger" plain size="mini" slot="reference" v-has="'system:org:delete'">删除</el-button>
                    </el-popconfirm>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
    import {queryOrgAll ,orgDel} from "src/api/permission"
    export default {
        name: "OrgList",
        data() {
            return {
                tableData: []
            }
        },
        activated(){
            this.queryAll()
        },
        methods: {
            queryAll(){
                queryOrgAll().then(response => {
                    if(response.code == 20000) {
                        this.tableData = response.data;
                    }
                })
            },
            del(row){
                orgDel({id:row.orgId}).then(response => {
                    if(response.code == 20000) {
                        this.$message.success({
                            message: '已成功删除该条组织信息',
                            duration: 2000,
                            center:true
                        });
                        this.queryAll()
                    }
                })
            }
        },
    }
</script>

<style lang="scss" scoped>
.org {
    &-container {
        margin: 30px;

        .control {
            &-area {
                margin-bottom: 8px;
            }
        }

        /*.pagination {*/
        /*    margin-top: 12px;*/
        /*    display: flex;*/
        /*    justify-content: center;*/
        /*}*/
    }
}
</style>